<template>
  <!-- class名用于限定全局样式命名空间, 避免污染基座应用 -->
  <locale-provider class="demo-root">
    <div ref="routerViewRef" class="app-content-root">
      <!-- <div v-if="isAppReady"> -->
        <router-view />
      <!-- </div> -->
      <!-- <top-component></top-component> -->
      <video-component></video-component>
    </div>
    <!-- 自行选择是否使用: 应用菜单 -->
    <!-- <SubProjectMenu :menu="menuList" v-model="selectMenuCode" @menuClick="menuClick" /> -->
  </locale-provider>
</template>

<script lang="ts" setup>
import { inject, ref, reactive, onMounted } from 'vue';
import LocaleProvider from '@/locales/locale-provider.vue';
// import TopComponent from './topComonent.vue'
import VideoComponent from './videoComponent.vue'
// 引入子应用的全局样式, 将被打包到基座应用 -->
import '@/global/style/main.less';
import { useScale } from '@/utils/scale';
// import AcIndexLayer from './ac-layer.vue';

defineOptions({ name: 'demo-router-view' });
const main = inject('main');
const {
  mapInstance,
  components: { AppTitle, SubProjectMenu },
  utils: { Enum },
  AC_NAME
}: any = main;
const routerViewRef = ref();

const { isAppReady } = useScale({
  domRef: routerViewRef
});

const selectMenuCode = ref('sim');
const menuList = reactive<any[]>([
  {
    name: '仿真',
    code: 'sim',
    icon: 'subapp-app',
    iconType: Enum.EnumIconType.PRESET
  },
  {
    name: '仿真1',
    code: 'sim1',
    icon: 'subapp-app',
    iconType: Enum.EnumIconType.PRESET,
    children: [
      {
        name: '仿真2',
        code: 'sim2'
      }
    ]
  }
]);
// const menuClick = (item) => {
//   console.log(item, 'menu');
// };


onMounted(() => {});
</script>

<style lang="less" scoped>
.app-content-root {
  height: 100%;
  pointer-events: none;

  > * {
    pointer-events: all;
  }
}
</style>
